<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>列表</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>

    <style>
        .home-recommendGoods-box > .home-recommendGoods-single1 > .home-recommendGoods-info > .info-3 > span:last-child:before {
            content: "";
            font-size: 15px;
        }
    </style>
</head>
<body>
  <div id="blank" class="header">
      <div v-back.tapmode class="back"></div>
      <span class="title">我的收藏</span>
      <span style="position:absolute;right:10px;font-size:15px;color:#1E90FF" onclick="setValue()" tapmode>更新</span>
  </div>
<div id="app" v-cloak style="padding-top:62px">
    <div class="my-order-body" v-if="myfavorsList.length==0" >
        <div style="text-align:center;padding-top: 60px;">
            <div style="text-align:center;padding-top: 70px;">
                <img v-src="'../../image/not_available.png'" width="70px" height="70px"/>
                <div style="padding-top:10px ">
                    <span>没找到您要的商品</span>
                </div>
            </div>
        </div>
    </div>
    <div class="home-recommendGoods-box" style="padding-top: 10px;"
         v-show="myfavorsList.length>0">
        <div class="home-recommendGoods-single1" v-for="(favor,index) in myfavorsList"
             v-myclick="[favor.goods_id, openGoodsDetail]" :key="favor.goods_id">
            <div class="home-recommendGoods-mallType" :style="{backgroundColor:favor.from_type_color}">
                {{favor.from_type_name}}
            </div>
            <img v-image-resize="{src:favor.pic}" :key="favor.goods_id">
            <div class="float-collection-modal" v-if="favor.unavailable==1"></div>
            <div class="float-collection-content" v-if="favor.unavailable==1"><span style="font-weight: 500"> {{favor.unavailable_text}}</span>
            </div>
            <div class="home-recommendGoods-info">
                <div class="info-1">{{favor.title}}</div>
                <div class="info-2">
                    <span class="span-1st">成交{{favor.sale_count}}笔</span>
                    <span class="span-2nd" v-if="favor.is_free_express == '1'">包邮</span>
                </div>
                <div class="info-3">
                    <span class="span-1st">券后价 ¥<span style="font-size: 14px;">{{favor.price}}</span></span>
                    <span class="span-2nd">¥{{favor.prime}}</span>
                </div>
                <p class="p-2nd" style="padding-top: 5px;font-size: 13px;vertical-align: middle">
                    <span class="span-2nd" v-if="favor.coupon_effective_end_time">有效期{{favor.coupon_effective_end_time}}</span>
                    <img style="float: right;height: 24px;width: 24px;margin-top: -4px;"
                         v-src="'../../image/home_icon_collected.png'" v-myclick.stop="[[favor,index], changeFavor]">
                </p>
            </div>
        </div>
    </div>
    <lazy-load v-if="myfavorsList.length > 0" style="background-color:#f7f7f7;margin:10px 0;"
               count-per-page="20"
               :arr="myfavorsList"
               :url="url">
    </lazy-load>
</div>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/components.js"></script>
<script>
    var vm;
    var myfavorsList;
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        });
        showProgress();
        var data = {
            member_id: getPrefs('member_id')
        };
        var callback = function (ret) {
            myfavorsList = ret.content;
            initApp();
            api.parseTapmode();
        };
        pinet.post(URL.myfavors, data, callback);
        addListeners();
    };
    function refresh() {
        var data = {
            member_id: getPrefs('member_id')
        };
        var callback = function (ret) {
            myfavorsList = ret.content;
            if (vm) {
                vm.myfavorsList = myfavorsList;
            }else{
                initApp();
            }
            api.refreshHeaderLoadDone();
        };
        var errback = function () {
            api.refreshHeaderLoadDone();
        };
        pinet.post(URL.myfavors, data, callback, errback);
    }

    function initApp() {
        var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data: {
                url:URL.myfavors,
                BSImg: {
                    big: isBigImg,
                    small: !isBigImg
                },
                myfavorsList: myfavorsList
            },
            methods: {
                changeFavor: function (good) {
                  api.confirm({
                      title: '提示',
                      msg: "取消收藏后，该商品将会在您的收藏列表消失",
                      buttons: ['取消收藏', '再想想']
                  }, function (ret, err) {
                      var index = ret.buttonIndex;
                      if (index == 1) {
                        for (var i=0, l=myfavorsList.length; i<l; i++) {
                            if(good.goods_id == myfavorsList[i].goods_id){
                                myfavorsList.splice(i, 1);
                                break;
                            }
                        }
                        var data = {
                            member_id: getPrefs('member_id'),
                            goods_id: good.goods_id
                        };
                        var callback = function (ret) {
                            api.sendEvent({
                                name: 'home'
                            });
                        };
                        pinet.post(URL.changeFavor, data, callback);
                      }
                  });
                },
                openGoodsDetail: function (goods_id) {
                    openWin('../home/browser', {goods_id: goods_id});
                },
            },
        });
    }

    function setValue() {
        if(vm.myfavorsList.length > 0 ){
            api.confirm({
                title: '提示',
                msg: "更新后，已失效的商品将在您的收藏列表内消失，是否更新？",
                buttons: ['确认更新', '再想想']
            }, function (ret, err) {
                var index = ret.buttonIndex;
                if (index == 1) {
                    var data = {
                        member_id: getPrefs('member_id')
                    };
                    var callback = function (ret) {
                        myfavorsList = ret.content;
                        if (vm) {
                            vm.myfavorsList = myfavorsList;
                        }else{
                            initApp();
                        }
                    };
                    pinet.post(URL.updMyFavors, data, callback);
                }
            });
        }else{
            alert('您没有收藏商品哦，无法更新');
        }
    }

    function addListeners() {
        api.addEventListener({
            name: 'collection'
        }, function () {
            window.location.reload();
        });
    }

</script>
</body>
</html>
